<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath = request.getScheme() + "://" + request.getServerName()
            + ":" + request.getServerPort() + request.getContextPath() + "/";
%>
<html>
<head>
    <title>查找学生</title>
    <base href="<%=basePath%>">
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.4.1.js"></script>
    <script type="text/javascript">
        $(function () {
            //在页面加载后，执行ajax，获取数据


            $("#doAjax").click(function () {

                getStudentInfo();
            })
        })

        function getStudentInfo() {
            $.ajax({
                url: "student/seekStudent.do",
                dataType: "json",
                success: function (resp) {
                    $("#stuinfo").empty();
                    $.each(resp,function(n){
                        $("#stuinfo").append(
                            "<tr><td>"+n.id+"</td><td>"
                            +n.name+"</td><td>"
                            +n.age+"</td></tr>");
                    })
                }
            })
        }
    </script>
</head>
<body>
<div align="center">
    <p>查询学生</p>
    <form action="student/seekStudent.do" method="post">
        <input placeholder="请输入学生的姓名" name="name">
        <input type="submit" value="查询" id="doAjax">
    </form>
    <table>
        <thead>
        <tr>
            <td>id</td>
            <td>姓名</td>
            <td>年龄</td>
        </tr>
        </thead>
        <tbody id="stuinfo">
        </tbody>
    </table>

</div>
</body>
</html>
